{extend name='base' /}

{block name='main'}
<style>

</style>
<div class="main-panel">
    <div class="content">
        <div class="page-inner">
            <div class="row">
                <div class="col-md-12">
                    <div class="card">
                        <div class="card-header">
                            <h4 class="card-title">编辑用户</h4>
                        </div>
                        <div class="card-body">
                            <form id="form">
                                <div class="form-group form-inline">
                                    <label for="input-thumb" class="col-md-2 col-form-label">头像 <span style="color: #f00;">*</span></label>
                                    <div class="col-md-10 p-0">
                                        <input type="text" class="form-control" id="input-thumb" name="data[avatar]" placeholder="请上传头像" value="{$user.avatar}">
                                        <span class="input-group-btn">
                                            <a class="btn btn-primary" href="javascript:uploadOneImage('#input-thumb', '#thumb-preview');">上传图片</a>
                                            <!--<a class="btn btn-warning" href="javascript:">预览</a>-->
                                        </span>
                                    </div>
                                    <div class="col-md-2"></div>
                                    <img id="thumb-preview" src="{$user.avatar}" style="max-width: 120px;">
                                </div>
                                <div class="form-group form-inline">
                                    <label for="username" class="col-md-2 col-form-label">用户名 <span style="color: #f00;">*</span></label>
                                    <div class="col-md-10 p-0">
                                        <input type="text" class="form-control" id="username" name="data[username]" placeholder="请输入账号" value="{$user.username}">
                                    </div>
                                </div>
                                <div class="form-group form-inline">
                                    <label for="truename" class="col-md-2 col-form-label">姓名 <span style="color: #f00;">*</span></label>
                                    <div class="col-md-10 p-0">
                                        <input type="text" class="form-control" id="truename" name="data[truename]" placeholder="请输入姓名" value="{$user.truename}">
                                    </div>
                                </div>
                                <div class="form-group form-inline">
                                    <label for="mobile" class="col-md-2 col-form-label">手机号 <span style="color: #f00;">*</span></label>
                                    <div class="col-md-10 p-0">
                                        <input type="text" class="form-control" id="mobile" name="data[mobile]" placeholder="请输入手机号" value="{$user.mobile}">
                                    </div>
                                </div>
                                <div class="form-group form-inline">
                                    <label for="email" class="col-md-2 col-form-label">邮箱</label>
                                    <div class="col-md-10 p-0">
                                        <input type="email" class="form-control" id="email" name="data[email]" placeholder="请输入邮箱" value="{$user.email}">
                                    </div>
                                </div>

                                <div class="form-group form-inline">
                                    <label class="col-md-2 col-form-label">状态</label>
                                    <div class="col-md-10 p-0" style="display: flex;align-items: center;">
                                        <label class="form-radio-label">
                                            <input class="form-radio-input" type="radio" name="data[status]" value="1" {if $user.status==1}checked{/if}>
                                            <span class="form-radio-sign" style="margin-top: 0.4rem;margin-left: 0.2rem">启用</span>
                                        </label>
                                        <label class="form-radio-label ml-3">
                                            <input class="form-radio-input" type="radio" name="data[status]" value="0" {if $user.status==0}checked{/if}>
                                            <span class="form-radio-sign" style="margin-top: 0.4rem;margin-left: 0.2rem">禁用</span>
                                        </label>
                                    </div>
                                </div>

                                <div class="form-group form-inline">
                                    <label class="col-md-2 col-form-label"></label>
                                    <div class="col-md-10 p-0">
                                        <button type="button" class="btn btn-success" onclick="add();">立即提交</button>
                                        <button type="button" class="btn btn-danger" onclick="window.history.back()">返回</button>
                                    </div>
                                </div>
                                <input type="hidden" name="id" value="{$user.id}">
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}

{block name='js'}
<script>
    var lock = false;
    function add() {
        if (lock) {
            return false;
        }
        lock = true;
        $.ajax({
            url: "{:url('user/edit')}",
            type: 'post',
            data: $("#form").serialize(),
            dataType: 'json',
            success: function (res) {
                if (res.code == 0) {
                    swal("提示", res.msg, {
                        icon : "error",
                        buttons: {
                            confirm: {
                                className : 'btn btn-danger'
                            }
                        },
                    });
                    lock = false;
                }else{
                    window.history.back();
                }
            }
        })
    }
</script>
{/block}